<template>
  <div class="sysBusyPrompt_wrapper">
    <div class="sysBusyPrompt_box">
      <div class="sysBusyPrompt_img">
        <img src="https://img.wifenxiao.com/h5-wfx/images/error/busy_prompt.png" alt="" />
      </div>
      <div class="sysBusyPrompt_txt">
        <p>
          尊敬的用户：由于当前访问人数较多，您已进入排队等候系统，请您耐心等待...
        </p>
      </div>
      <div class="sysBusyPrompt_btn" @click="refresh">刷新</div>
    </div>
  </div>
</template>

<script>
import { getCommonConfig } from '@/api/login'
import Vue from 'vue'
export default Vue.extend({
  name: 'index',
  data() {
    return {
      sid: '',
      nums: ''
    }
  },
  created() {
    const params = this.$route.query
      window.addEventListener('wxload', query => {
        // console.log(query , '限流')
        this.sid = query.sid || params.sid
        this.nums = query.close_num || params.close_num
      })
    
  },
  mounted() {
    this.$loadingWrap.show()
    setTimeout(() => {
      this.$loadingWrap.close() // 关闭loading
    }, 50)
  },
  methods: {
    // 刷新
    refresh() {
      getCommonConfig().then(res => {
        wx.navigateBack({
          delta: 1
        }) // 返回上一层
      }).catch(error => {
        if (error.response.status == 510) {
          this.$Error('排队等候中，请稍后重试')
        }
        // console.log(error)
      })
    }
  }
})
</script>

<style lang="scss">
.sysBusyPrompt_wrapper {
  width: 100%;
  .sysBusyPrompt_box {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 72.8%;
    text-align: center;
    transform: translate(-50%, -50%);
    .sysBusyPrompt_img {
      width: 350px;
      margin: 0 auto 34px;
      img {
        max-width: 100%;
        width: 100%;
      }
    }
    .sysBusyPrompt_txt {
      font-size: 26px;
      color: #999;
      line-height: 44px;
      margin-bottom: 64px;
    }
    .sysBusyPrompt_btn {
      font-size: 32px;
      color: #f30c23;
      width: 416px;
      height: 80px;
      line-height: 78px;
      text-align: center;
      margin: 0 auto;
      border: 1px solid #f30c23;
      border-radius: 38px;
    }
  }
}
</style>